<template>
	<div id="meal_fee_edit" class="dialog animated" :class="open? 'fadeIn':'fadeOut'" v-show="show">
		<div class="panel animated" :class="open? 'zoomIn':''">
			<div class="title">
				编辑餐费
				<div class="close" @click="cancel()"></div>
			</div>
			<div class="form">
				<div class="row">
					<label class="label">
						<span>*</span>
						餐费名称
					</label>
					<el-input v-model="param.name" id="name" style="width: 3rem;" maxLength="20" clearable></el-input>
				</div>
				<div class="row">
					<label class="label">
						<span></span>
						成本单价
					</label>
					￥
					<el-input-number v-model="param.costPrice" id="costPrice" style="width: 1.5rem;"
						 controls-position="right" size="small" :precision="2" :min="0" :max="999999"></el-input-number>
					<!--<el-input v-model="param.costPrice" :precision="2" id="costPrice" style="width: 1.1rem;" maxLength="10"></el-input>-->
					元/天
				</div>
				<div class="row">
					<label class="label">
						<span>*</span>
						销售单价
					</label>
					￥
					<el-input-number v-model="param.salesPrice" id="salesPrice" style="width: 1.5rem;"
						 controls-position="right" size="small" :precision="2" :min="0" :max="999999"></el-input-number>
					元/天
				</div>
				
				
				<div class="row_2">
					<label class="label">收费规则</label>
					<label v-if="param.type==1">中餐（预收费）</label>
					<label v-if="param.type==2">晚餐（先记账，后结算）</label>
				</div>
				
				<div class="row" v-if="param.type==1">
					<label class="label">
						<span>*</span>
						退费规则
					</label>
					
					<div class="radio_group">
						<label class="radio" @click="param.refundRulesMode = 0">
							<span class="radio_circle" :class="param.refundRulesMode===0? 'radio_active' : ''"></span>
							<span class="radio_name">不退费</span>
						</label>
						<br />
						<label class="radio" @click="param.refundRulesMode = 1">
							<span class="radio_circle" :class="param.refundRulesMode===1? 'radio_active' : ''"></span>
							<span class="radio_name">连续请假</span>
							<el-input v-model="param.refundRulesDay" id="refundRulesDay" style="width: 0.6rem;" maxLength="3"></el-input>
							<span class="radio_name">天，退餐费</span>
						</label>
					</div>
				</div>
				
			</div>
			<div class="btn_div">
				<div class="btn_sure" @click="sure()">确 定</div>
				<div class="btn_cancel" @click="cancel()">取 消</div>
			</div>
		</div>
	
	</div>
</template>

<script>
var vm,dict;

export default {
	data : function() {
		return {
			show : false,
			open : false,
			param : {},
		}
	},
	watch : {
		"param.refundRulesDay" : function(val) {
			this.param.refundRulesDay = tool.parseInt(val);
		}
	},
	methods : {
		init : function(mealfee) {
			vm.show = true;
			vm.open = true;
			
			//克隆餐费对象
			vm.param = tool.clone(mealfee);
			
			vm.param.campusId = vm.param.campusId || vm.$store.state.campusId;
			vm.param._wait = "";
		},
		cancel : function() {
			//隐藏弹窗
			vm.open = false;
			setTimeout(function() {
				vm.show = false;
			},500);
		},
		sure : function() {
			//验证规则
			var rules = [{
				judge : vm.param.name,
				focus : $("#meal_fee_edit #name"),
				tips : "请填写餐费名称"
			},{
				judge : vm.param.salesPrice >= 0,
				focus : $("#meal_fee_edit #salesPrice input"),
				tips : "请填写销售单价"
			},{ //要么是晚餐,要么有选退费规则
				judge : vm.param.type==2 || vm.param.refundRulesMode !== null,
				tips : "请选择退费规则"
			},{
				judge : vm.param.type==2 || vm.param.refundRulesMode !== 1 || vm.param.refundRulesDay >= 1,
				focus : $("#meal_fee_edit #refundRulesMode"),
				tips : "连续请假的天数至少1天"
			}];
			
			if(!tool.validate(rules)) {
				return;
			}
			//成本价,有可能会被删除,变成undefined,重设为0
			vm.param.costPrice = vm.param.costPrice||0;
			
			api.mealFeeUpdate(vm.param).then(function(data) {
				tool.message({ showClose: true, message: "修改成功", type: 'success' });
				vm.$emit('callback');
			    vm.cancel();
			})
			
		},
	},
	created : function() {
		vm = this;
		dict = tool.getItem(lsKey.dict,true);
		vm.channelMode = dict["channel_mode"];
	}
}
</script>
<style lang="scss">
	#meal_fee_edit {
		.el-input__inner {
			border-radius: 0.04rem;
		}
	}
</style>
<style scoped src="@/style/module/dialog.css"></style>
<style scoped src="@/style/module/radio.css"></style>
<style scoped>
	#costPrice {
		border-radius: 0.04rem;
	}
	.panel {
		width: 6rem;
	}
	.radio_group {
		/*width: 5.4rem;*/
		padding-top: 0.07rem;
		line-height: 0.36rem;
		vertical-align: top;
	}
	.form {
		padding: 0 0.5rem;
		font-size: 0.16rem;
		color: #666666;
	}
	.row {
		line-height: 0.5rem;
	}
	.row_2 {
		margin-top: 0.1rem;
		padding-top:0.1rem ;
		border-top: 0.01rem solid #DEDEDE;
		line-height: 0.5rem;
	}
	.label {
		width: 0.9rem;
		display: inline-block;
		text-align: right;
		margin-right: 0.15rem;
	}
	.label>span {
		color: red;
		display: inline-block;
		width: 0.1rem;
		position: relative;
		top: 0.02rem;
	}
</style>